export default function(resource) {
  return {
    data() {
      let initData = {
        page: {
          current_page: 0,
          first_page_url: null,
          from: 0,
          last_page: 0,
          last_page_url: null,
          next_page_url: null,
          path: null,
          per_page: 0,
          prev_page_url: null,
          to: 0,
          total: 0
        },
        idArr: [],
        isLine: []
      };

      for (const key in resource) {
        initData[key] = null;
      }

      return initData;
    },
    created() {
      this.$http.get(resource.listData).then(res => {
        console.log(res.data.data);
        let listData = res.data.data;
        this.updateData(listData);
        //   取出每一项的id
        this.listData.forEach((element, index) => {
          this.idArr[index] = element.id;
        });
        // 打卡websocket
        this.initWebSocket(this.idArr);
      });
    },
    methods: {
      updateData(e) {
        this.listData = e.data;

        this.page.current_page = e.current_page;
        this.page.first_page_url = e.first_page_url;
        this.page.from = e.from;
        this.page.last_page = e.last_page;
        this.page.last_page_url = e.last_page_url;
        this.page.next_page_url = e.next_page_url;
        this.page.path = e.path;
        this.page.per_page = e.per_page;
        this.page.prev_page_url = e.prev_page_url;
        this.page.to = e.to;
        this.page.total = e.total;
      },

      // websocket
      initWebSocket(status) {
        var that = this;
        if ("WebSocket" in window) {
          that.websocket = new WebSocket(
            "ws://39.106.33.62:9502?fromId=" + sessionStorage.getItem("user_ID")
          );
        } else if ("MozWebSocket" in window) {
          that.websocket = new WebSocket(
            "ws://39.106.33.62:9502?fromId=" + sessionStorage.getItem("user_ID")
          );
        } else {
          that.$message.success("浏览器不支持websocket");
          // console.log('当前浏览器 Not support websocket');

          that.interval = window.setInterval(function() {
            //每隔30秒钟发送一次心跳，避免websocket连接因超时而自动断开
            that.forgeWebSocket();
          }, 30000);
        }

        that.interval = window.setInterval(function() {
          //每隔30秒钟发送一次心跳，避免websocket连接因超时而自动断开
          if (that.websocket != null) {
            // that.websocket.send("HeartBeat");
            // console.log("发送心跳包：HeartBeat");
          }
        }, 30000);

        //连接发生错误的回调方法
        that.websocket.onerror = function(ev) {
          console.log(ev, "error");
          console.log("WebSocket连接发生错误!");
          that.$message.error("WebSocket连接发生错误!");
        };

        //连接成功建立的回调方法
        that.websocket.onopen = function() {
          console.log("WebSocket连接成功!");
          if (typeof status == "object") {
            console.log(status);
            that.send(status);
          } else if (status == "在线") {
            that.sendOn();
          } else {
            that.sendOff();
          }
        };
        //接收到消息的回调方法
        that.websocket.onmessage = function(event) {
          let reutrnMessage = JSON.parse(event.data);

          if (reutrnMessage.code == 102) {
            that.centerDialogVisible = true;
          }

          if (reutrnMessage.code == 200) {
            // 初始化页面情况
            console.log(reutrnMessage);

            reutrnMessage.content.forEach((item, index) => {
              that.isLine[index] = reutrnMessage.content[index];
            });
            that.listData.forEach((item, index) => {
              that.$set(that.listData[index], "status", that.isLine[index]);
            });
          }
          if (reutrnMessage.code == 202) {
            console.log(reutrnMessage);
            // 筛选在线情况
            that.updateData(reutrnMessage.content);
            console.log(reutrnMessage.content);
          }
          if (reutrnMessage.code == 203) {
            
            that.updateData(reutrnMessage.content);
            console.log(reutrnMessage.content);
          }
        };
        //连接关闭的回调方法
        that.websocket.onclose = function() {
          that.$message.error("连接已断开!");
          // console.log("WebSocket连接关闭");
          that.websocket = null;
        };
      },
      send(content) {
        if (this.websocket && this.websocket != null) {
          let data = {
            code: 200,
            content: content,
            fromId: sessionStorage.getItem("user_ID")
          };

          this.websocket.send(JSON.stringify(data));
        }
      },
      //发送消息
      sendOn() {
        if (this.websocket && this.websocket != null) {
          let data = {
            code: 202,
            fromId: sessionStorage.getItem("user_ID")
          };

          this.websocket.send(JSON.stringify(data));
        }
      },
      sendOff() {
        if (this.websocket && this.websocket != null) {
          let data = {
            code: 203,
            fromId: sessionStorage.getItem("user_ID")
          };

          this.websocket.send(JSON.stringify(data));
        }
      },
      //关闭WebSocket连接
      closeWebSocket() {
        if (this.websocket != null) {
          this.websocket.onclose();
          console.log("已执行closeWebSocket中关闭websocket操作");
        }
        if (this.interval) {
          window.clearInterval(this.interval);
          console.log("清除定时器");
        }
      },
      beforeDestroy() {
        this.closeWebSocket();
      }
    }
  };
}
